@extends('admin.common.app')
@section('cont')
    <section class="Hui-article-box" id="app">
        <nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页
            <span class="c-gray en">&gt;</span>管理员
            <span class="c-gray en">&gt;</span>添加管理员
            <a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" >
                <i class="Hui-iconfont">&#xe68f;</i>
            </a>
        </nav>
        <article class="cl pd-20">
            @include('admin.common.msg')
            <form action="{{ route('admin.grade.store') }}" method="post" class="form form-horizontal" id="form-admin-add">
                @csrf
                <div class="row cl">
                    {{--考试民初--}}
                    <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>考试信息：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        考试名称：
                        <span class="select-box" style="width:150px;">
                         <select onchange="chg(this);" class="select" id="test_name" name="test_name" size="1">
                             <option value="-1">请选择</option>
                             @foreach($examinfo_name as $test_name)
                                 <option value="{{$test_name}}" >{{$test_name}}</option>
                             @endforeach
                        </select>
                    </span>
                        班级名称：
                        <span class="select-box" style="width:150px;">
                         <select onchange="chg1(this);" class="select" id="class_name" name="class_name" size="1">
                               <option value="-1">请选择</option>
                        </select>
                    </span>
                        科目：
                        <span class="select-box" style="width:150px;">
                         <select class="select" id="subject" name="subject" size="1">
                               <option value="-1">请选择</option>
                        </select>
                    </span>
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>学号：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <input type="text" class="input-text" autocomplete="off" value="" placeholder="学号" id="student_code" name="student_code" autocapitalize="off">
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>姓名：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <input type="text" class="input-text" autocomplete="off" value="" placeholder="姓名" id="name" name="name" autocapitalize="off">
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>考试分数：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <input type="text" class="input-text" autocomplete="off" value="" placeholder="考试分数" id="score" name="score" autocapitalize="off">
                    </div>
                </div>
                <div class="row cl">
                    <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
                        <input class="btn btn-primary radius" type="submit" value="&nbsp;&nbsp;添加成绩&nbsp;&nbsp;">
                    </div>
                </div>
            </form>
        </article>
    </section>
@endsection
@section('js')
    <script type="text/javascript" src="/admin/lib/jquery.validation/1.14.0/jquery.validate.js"></script>
    <script type="text/javascript" src="/admin/lib/jquery.validation/1.14.0/validate-methods.js"></script>
    <script type="text/javascript" src="/admin/lib/jquery.validation/1.14.0/messages_zh.js"></script>
    <script type="text/javascript">
        // var vm =new Vue({
        //     el:"#app",
        //     data: {
        //         return{
        //             optionList:[], // 第二组数据
        //             optionList1:[] // 第三组
        //         }
        //     },
        //     method:{
        //         chg(obj) {
        //               $.ajax({
        //                   url:"{{route('admin.grade.store')}}",
        //                   type:'POST',
        //                   data:{
        //                       _token:'{{csrf_token()}}',
        //                       test_name:obj,
        //                   },
        //                   //成功回调函数
        //                   success:(json)=>{
        //                       if (json.status==0){
        //                           if(this.optionList.length > 0){
        //                               this.optionList = []
        //                               this.optionList = json.class_name
        //                           }else{
        //                               this.optionList = json.class_name
        //                           }
        //                       }
        //                   }
        //               })
        //         },
        //         chg1(obj) {
        //                 //何其选中的值
        //                 let class_name=$(obj).val();
        //                 //let test_name= $('#test_name').val();
        //                 $.ajax({
        //                     url:"{{route('admin.grade.store')}}",
        //                     type:'POST',
        //                     data:{
        //                         _token:'{{csrf_token()}}',
        //                         class_name,
        //                         obj,
        //                     },
        //                     //成功回调函数
        //                     success:(json)=>{
        //                         if (json.status==0){
        //                             //获取子元素
        //                             if(this.optionList1.length > 0){
        //                                 this.optionList1 = []
        //                                 this.optionList1 = json.subject
        //                             }else{
        //                                 this.optionList1 = json.subject
        //                             }
        //                         }
        //                     }
        //                 })
        //         }
        //     }
        // })
        function chg(obj) {
            if (obj.value != -1) {
                //何其选中的值
                var test_name=$(obj).val();
                $.ajax({
                    url:"{{route('admin.grade.store')}}",
                    type:'POST',
                    data:{
                        _token:'{{csrf_token()}}',
                        test_name:test_name,
                    },
                    //成功回调函数
                    success:function(json){
                        $("#DeleteList2").remove();
                        $("#DeleteList3").remove();
                        if (json.status==0){
                            //获取子元素
                            for (arr of json.class_name) {
                                var list="<option id='DeleteList2' value='"+arr+"'>"+arr+"</option>"
                            }
                            $('#class_name').children('option').after(list);
                        }
                    }
                })
            }
        }
        function chg1(obj) {
            if (obj.value != -1) {
                //何其选中的值
                let class_name=$(obj).val();
                let test_name= $('#test_name').val();
                $.ajax({
                    url:"{{route('admin.grade.store')}}",
                    type:'POST',
                    data:{
                        _token:'{{csrf_token()}}',
                        class_name,
                        test_name,
                    },
                    //成功回调函数
                    success:function(json){
                        $("#DeleteList3").remove();
                        if (json.status==0){
                            //获取子元素
                            for (arr of json.subject) {
                                var list="<option id='DeleteList3' value='"+arr+"'>"+arr+"</option>"
                            }
                            $('#subject').children('option').after(list);
                        }
                    }
                })
            }
        }

        $(function(){
            $('.skin-minimal input').iCheck({
                checkboxClass: 'icheckbox-blue',
                radioClass: 'iradio-blue',
                increaseArea: '20%'
            });
            $("#form-admin-add").validate({
                rules:{
                    phone:{
                        required:true,
                        phone:true
                    },
                    email:{
                        required:true,
                        email:true,
                    },
                    username:{
                        required:true,
                        minlength:4,
                        maxlength:16
                    },
                    truename:{
                        required:true,
                        isChinese:true
                    },
                    password:{
                        required:true,
                    },
                    password_confirmation:{
                        required:true,
                        equalTo: "#password"
                    },
                },
                message:{
                    username:{
                        required:'用户名不能为空',
                        minlength:'用户名长度必须大于4位',
                        maxlength:'用户名不能超过16位'
                    },
                    truename:{
                        required:'姓名不能为空',
                    },
                    password:{
                        required:'初始密码不能为空',
                    },
                    password_confirmation:{
                        required:'确认密码不能为空',
                        equalTo: '两次密码不一样'
                    },
                    phone:{
                        required:'手机号不能为空',
                    },
                    email:{
                        required:'邮箱不能为空',
                        email:'你输入的不是邮箱',
                    },
                },
                onkeyup:false,
                success:"valid",
                submitHandler: function (form) {
                    // 表单提交
                    form.submit();
                }
            });
            // 自定义验证规则
            // 邮政编码验证
            jQuery.validator.addMethod("phone", function (value, element) {
                //    var reg1 = /^\+86-1[3-9]\d{9}$/;
                var reg2 = /^1[3-9]\d{9}$/;
                var ret = reg1.test(value);
                return this.optional(element) || ret;
            }, "请输入正确的手机号码");
        });
    </script>

@endsection
